<template>
        <div class="toast" >
            <i :class="['iconfont', $store.state.toast.icon]"></i>
            <div>{{ $store.state.toast.content }}</div>
        </div>
</template>
<script>

export default {
    data() {
        return {


        }
    }
}
</script>
 
<style lang = "less" scoped>
@import "../../assets/base.less";
.toast {
    position: fixed;
    left: 50%;
    top: 2px;
    transform: translate(-50%);
    background-color: #f5f5f5;
    padding: 10px 20px;
    border-radius: 5px;
    box-shadow: 0 0 10px #f5f5f5;
    z-index: 20;
    display: flex;
    justify-content: center;
    i {
        // margin-right: 5px;
        color:@orange;
    }
}
</style>